
function init(dom, use24or12) {
    this.column = Array.from(dom);
    this.use24or12 = use24or12;
    this.createDom();
    this.start();
    this.classList=['first','second','thrid','four','five','five']
}
init.prototype.start = function () {
    var self = this;//指向当前时间 如果没改下方会指向Window
    setInterval(function () {
        var c = self.getClock();
       
        self.column.forEach(function (ele, index){
            var n = + c[index];
            var offset = n * 86;
            $(ele).css({
                'transform':'translateY(calc(50vh - '+ offset + 'px - 43px))'
            });
            Array.from(ele.children).forEach(function(ele2,index2){
                var className=self.getClass(n,index2);
                $(ele2).attr('class',className);
            })
        })
    }, 500);
}
init.prototype.getClass=function(n,i){
    var className=this.classList.find(function(ele,index){
        return i - index === n || i + index === n ;

    });
    return className||'';
}

init.prototype.getClock = function () { //处理时间格式
    var d = new Date();
    return [this.use24or12 ? d.getHours() : d.getHours() % 12 || 12, d.getMinutes(), d.getSeconds()].reduce(function (p, n) {
        return p + ('0' + n).slice(-2);
    }, '')
}
init.prototype.createDom = function () {
    for (var i = 0; i < 6; i++) {
        var sixDiv = '<div>' + i + '</div>'
        $('.six').append(sixDiv)
    }
    for (var i = 0; i < 10; i++) {
        var tenDiv = '<div>' + i + '</div>'
        $('.ten').append(tenDiv)
    }
}
new init($('.column'), true);